<!DOCTYPE html>
<html lang="en">
<head>
    <th:block th:include="include :: header('评论管理')" />
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px;">
                <div class="layui-form layui-form-pane">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">评论内容</label>
                            <div class="layui-input-inline">
                                <input type="text" name="comment" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">评论账号</label>
                            <div class="layui-input-inline">
                                <input type="text" name="username" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button id="queryArticle" type="submit" class="layui-btn layui-btn-primary"  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                    </div>
                </div>
            </div>
        </fieldset>
        <table id="commentTable" lay-filter="commentTableFilter"></table>
    </div>
</div>
</body>
<script type="text/html" id="currentTableBar" lay-filter="currentTableBar">
    <!--表格顶部按钮-->
<!--    <div class="layui-btn-container">-->
<!--        <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete"> 删除 </button>-->
<!--    </div>-->
</script>
<script type="text/html" id="toolBar">
    <!--表格右侧操作栏-->
    <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
</script>
<th:block th:include="include :: footer" />
<script>
    layui.use(['table','form','jquery'],function (){
        var table = layui.table;
        var form = layui.form;

        /**
         * 表格初始化
         */
        table.render({
            elem: "#commentTable",
            url: "/comment/admin/tableList",
            toolbar: "#currentTableBar",
            id: "currentCommentTable",
            cols: [
                [
                    {type: 'checkbox'},
                    {field: '', title: '序号',width:60,templet:function (d){
                            return d.LAY_INDEX;
                        }},
                    {field: 'articleTitle', title: '博客标题',width:200},
                    {field: 'username', title: '发布账号', width: 100},
                    {field: 'nickname', title: '发布昵称', width: 180},
                    {field: 'articleComments', title: '评论内容', width: 250},
                    {field: 'createTime', title: '创建时间', width: 180},
                    {fixed: 'right', title:'操作', toolbar: '#toolBar', width:150}
                ]
            ],
            limits: [10, 15, 20, 25, 50, 100],
            limit: 10,
            page: true,
            skin: 'line',
            parseData: function(res){//将原始数据解析成 table 组件所规定的数据
                console.log(res)
                var result;
                if(this.page.curr){
                    result = res.data.slice(this.limit*(this.page.curr-1),this.limit*this.page.curr);
                }
                else{
                    result=res.data.slice(0,this.limit);
                }
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": result //解析数据列表
                };
            }
        })

        form.on('submit(data-search-btn)', function (data) {
            table.reload('currentCommentTable', {
                url: '/comment/admin/tableList'
                , where: {
                    "comment": data.field.comment,
                    "username": data.field.username
                } //设定异步数据接口的额外参数
                //,height: 300
            });
        })

        table.on('tool(commentTableFilter)',function (obj){
            const url = '/comment/admin/delete?commentId='+obj.data.commentId
            Pt.openModalBox("<h3 style=\"font-weight: bold\">确定删除这个评论吗<h3>",url,"40%","50%")
        })
    })
</script>
</html>
